<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8" />
	<script type="text/javascript" src="../../lib/jstree/jquery.jstree.js"></script>
	<script id="courseoffering-details-nav-holder-tmpl" type="text/x-handlebars-template">
		<div {{generateCourseDetailDivId this}}>
			</div>
	</script>

	<script id="courseoffering-details-nav-tmpl" type="text/x-handlebars-template">
		<ul>
			{{#each lessons}}
			<li data-type="LESSON" data-name="{{name}}">
			<a>{{title}}</a>
			{{>units-recursion}}
			</li>
			{{/each}}
			</ul>
	</script>

	<script id="units-recursion-partial" type="text/x-handlebars-template">
		{{#if units}}
			<ul>
			{{#each units}}
			<li data-type ="UNIT" data-name="{{name}}" >
			<a>{{title}}</a>
			{{>units-recursion}}
			</li>
			{{/each}}
			</ul>
			{{/if}}
	</script>

	<script id="resources-list" type="text/x-handlebars-template">
		{{#if resources}}
			<ul class="resources">
			{{#each resources}}
			<li>
			<div class="resource-thumb">
			<img width="40" height="40" alt="User" src="{{resource_thumb}}">
			</div>
			<div>
			<span class="resource-info">{{resourceInfo}}</span>
			<p>
			{{resourceSummary}}
			</p>
			<div class="resource-actions">
			<button class="btn btn-primary btn-mini">
			Edit
			</button>
			<button class="btn btn-success btn-mini">
			Delete
			</button>
			</div>
			</div>
			</li>
			{{/each}}
			</ul>
			{{/if}}
	</script>

	<script id="comments-list" type="text/x-handlebars-template">
		{{#if comments}}
			<ul class="comments">
			{{#each comments}}
			<li>
			<div class="comment-avatar">
			<a href="#"><img src="{{commentThumb}}"></a>
			</div>
			<div class="comment-content">
			<span class="comment-name"><a href="#">{{commentedBy}}</a></span>
			<span class="comment-date">
			<p>
			{{commentedOn}}
			</p>
			</span>
			<p>
			{{commentDesc}}
			</p>
			<div class="btn-group">
			<a rel="tooltip" class="btn" href="#" data-original-title="Reply"><i class="icon-comment"></i></a>
			</div>
			</div>
			</li>
			{{/each}}
			</ul>
			{{/if}}
	</script>

	<script>
		$(document).ready(function() {
			$("#coTab").tab();
		});
	</script>

</head>

<body>
	<div class="row course-main">

		<div class="col-md-9 current-content">

			<div class="current-content">
				<div class="row">
					<div class="col-md-12">
						<div class="tabbable">
							<ul class="nav nav-tabs" data-tabs="tabs" id="coTab">
								<li class="active">
									<a href="#info" data-toggle="tab">Info</a>
								</li>
								<li>
									<a href="#structure" data-toggle="tab">Structure</a>
								</li>
								<li>
									<a href="#resources" data-toggle="tab">Resources</a>
								</li>
								<li>
									<a href="#comments" data-toggle="tab">Comments</a>
								</li>
							</ul>
						</div>
						<div id="myTabContent" class="tab-content">
							<div class="tab-pane active" id="info">
								<div class="row">
									<div class="thumbnail col-md-3" style="width: 100px;height: 100px">
										<img alt="" src="../../assets/img/ias3.png" />
									</div>
									<div class="col-md-4">
										<p>
											Course Offering Title
										</p>
										<p>
											Course Offering Author
										</p>
										<div id="co_rating"></div>

										<div id="co_descr" class="descr">
										</div>

									</div>
								</div>
							</div>
							<div class="tab-pane" id="structure">
								<div id="treeViewDiv"></div>
							</div>
							<div class="tab-pane" id="resources">
								<ul class="resources">
									<li>
										<div class="resource-thumb">
											<img width="40" height="40" alt="User" src="../../assets/img/pdf.jpg">
										</div>
										<div>
											<span class="resource-info">Resource 1 : No of Pages : 50</span>
											<p>
												Max Webex : Theory of Hierarchy
											</p>
											<div class="resource-actions">
												<button class="btn btn-primary btn-mini">
													Edit
												</button>
												<button class="btn btn-success btn-mini">
													Delete
												</button>
											</div>
										</div>
									</li>
									<li>
										<div class="resource-thumb">
											<img width="40" height="40" alt="User" src="../../assets/img/pdf.jpg">
										</div>
										<div>
											<span class="resource-info">Resource 2 : No of Pages : 50</span>
											<p>
												Maslow's Theory of motivation
											</p>

											<div class="resource-actions">
												<button class="btn btn-primary btn-mini">
													Edit
												</button>
												<button class="btn btn-success btn-mini">
													Delete
												</button>
											</div>
										</div>
									</li>
									<li>
										<div class="resource-thumb">
											<img width="40" height="40" alt="User" src="../../assets/img/pdf.jpg">
										</div>
										<div>
											<span class="resource-info">Resource 3 : Video Length : 12 mins</span>
											<p>
												Indian Administration
											</p>
											<div class="resource-actions">
												<button class="btn btn-primary btn-mini">
													Edit
												</button>
												<button class="btn btn-success btn-mini">
													Delete
												</button>
											</div>
										</div>
									</li>
								</ul>

							</div>
							<div class="tab-pane" id="comments">
							</div>
						</div>
					</div>
				</div>
				<!--/col-->
			</div>
		</div>
	</div>





	</div>
</body>

</html>